<template>
	<view class="seckill-activity u-flex-col u-flex-end" :style="{backgroundImage:`url(${background})`}"
		@click.stop="$navigateTo('/subPackages/seckillProduct/index')" v-if="dataList.length > 0">
		<view class="seckill-activity-content">
			<view class="li" v-for="(item,index) in dataList" :key="index"
				@click.stop="$navigateTo('/subPackages/seckillProduct/detail?seckill_id='+item.id)">
				<u-image :src="item.product.cover_image || ''" width="160rpx" height="140rpx" radius="8rpx"></u-image>
				<view class="li-content">
					<view class="li-price">原价{{item.product.minPriceSpec.original_price}}</view>
					<view class="li-heat u-flex u-flex-center" :style="{backgroundImage:`url(${$getImageUrl('heatBase')})`}">
						<view class="u-flex u-col-start">
							<view class="heat-text">HOT</view>
							<image class="li-img" :src="$getImageUrl('/user_client/static/icons/dheat.png')" mode=""></image>
						</view>
						<view class="heat-price">{{item.product.minPriceSpec.seckill_price}}</view>
					</view>
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				heatBase: '/images/rd.png',
				dataList: [],
				timerId: null,
				pageSize: 4,
				intervalTime: 2500,
			}
		},
		props: {
			background: {
				type: String,
				default: ''
			},
		},
		methods: {
			getInit(e) {
				var that = this;
				const total = e.length;
				let page = 0;
				const switchData = () => {
					const dataList = e.slice(page, page + that.pageSize);
					if (dataList.length > 0) {
						that.dataList = dataList;
						if (that.pageSize > dataList.length) {
							page = 0;
						} else {
							page += that.pageSize;
						}
					} else {
						page = 0;
					}
				};
				switchData(); // 首次执行一次以避免延迟
				// 启动定时器并保存定时器ID
				this.timerId = setInterval(() => {
					switchData();
				}, this.intervalTime);
			},
			stopSeckillActivitySwitch() {
				uni.removeInterval(this.timerId); // 清除定时器
				this.timerId = null; // 清除保存的定时器ID
			},
		}
	}
</script>

<style lang="scss">
	.seckill-activity {
		padding: 88rpx 12rpx 24rpx;
		box-sizing: border-box;
		margin-top: 30rpx;
		background-size: 100% 100%;
		background-repeat: no-repeat;

		.seckill-activity-content {
			display: grid;
			grid-column-gap: 10rpx;
			grid-template-columns: 1fr 1fr 1fr 1fr;
			margin-top: 22rpx;

			.li {
				background-color: #FFFFFF;

				.li-content {
					padding: 10rpx 0rpx 12rpx;
					box-sizing: border-box;

					.li-price {
						text-align: center;
						font-size: 20rpx;
						color: #999999;
						text-decoration: line-through;
					}

					.li-heat {
						width: 100%;
						height: 37rpx;
						margin-top: 8rpx;
						line-height: 1;
						background-size: 100% 100%;
						background-repeat: no-repeat;

						.heat-text {
							font-size: 20rpx;
							color: #F3F3F3;
						}

						.li-img {
							margin: 0 6rpx 0 2rpx;
							width: 14rpx;
							height: 17rpx;
						}

						.heat-price {
							font-size: 28rpx;
							color: #FFFFFF;
						}
					}
				}
			}
		}
	}
</style>